<template>
  <h-container>
    <div class="alert alert-danger">
      <div>
        注意：该页面显示<span class="i-info"> 已付款单未申请发货 </span>的商品列表，请根据下面的列表尽早申请发货
      </div>
      <div>
        注意：如果在系统中存在<span class="i-info">运费单未付款将不能申请发货。</span>
      </div>
      <div>
        注意：未更新单号之前每次领货都会合并到同一个队列中，有多少领多少即可。
      </div>
    </div>
    <div class="h-toolbar">
      <div class="inline-item">
        <div class="label inline">
          订单时间:
        </div>
        <h-date-range-picker v-model="date"/>
        <el-button type="primary" @click="searchData" style="margin-right: 10px;"><i class="fa fa-search"></i> 查询
        </el-button>
      </div>
      <div class="inline-item">
        <div class="label inline">
          状态分类:
        </div>
        <div class="inline">
          <el-radio-group v-model="type">
            <el-radio :label="0"> 待领货</el-radio>
            <el-radio :label="1"> 领货未发</el-radio>
            <el-radio :label="2"> 领货已发</el-radio>
          </el-radio-group>
        </div>
      </div>
    </div>
    <div v-show="type==0">
      <h-deliver-display :date="date"  :type="type" ref="a"/>
    </div>
    <div v-show="type==1">
      <h-applied-display :date="date"  :type="type" ref="b"></h-applied-display>
    </div>
    <div v-show="type==2">
      <h-deliveried-display :date="date" :type="type" ref="c"/>
    </div>
  </h-container>


</template>
<script>
  import HContainer from 'src/components/shop/layout/Container'
  import HDateRangePicker from 'src/components/common/HDateRangePicker'
  import HOrderStatusDisplay from 'src/components/common/display/HOrderStatusDisplay'
  import HGoodInfoDisplay from 'src/components/common/display/HGoodInfoDisplay'
  import HSpecsDisplay from 'src/components/common/display/HSpecsDisplay'
  import HOrderInfoDisplay from 'src/components/common/display/HOrderInfoDisplay'
  import HOrderApplyDailog from 'src/components/shop/common/HOrderApplyDialog'
  import HOrderPayInfoDisplay from 'src/components/common/display/HOrderPayInfoDisplay'
  import HAppliedDisplay from 'src/components/shop/common/AppliedDisplay'
  import HDeliveriedDisplay from 'src/components/shop/common/DeliveriedDisplay'
  import HDeliverDisplay from 'src/components/shop/common/DeliverDisplay'

  export default {
    name: 'HDeliver',
    components: {
      HContainer,
      HDateRangePicker,
      HOrderStatusDisplay,
      HGoodInfoDisplay,
      HSpecsDisplay,
      HOrderInfoDisplay,
      HOrderApplyDailog,
      HOrderPayInfoDisplay,
      HAppliedDisplay,
      HDeliveriedDisplay,
      HDeliverDisplay
    },
    data() {
      return {
        type: 0,
        date: []
      }
    },
    methods: {
      searchData: function () {
        if (this.type == 0) {
          this.$refs.a.searchData();
        } else if (this.type == 1) {
          this.$refs.b.searchData();
        } else if (this.type == 2) {
          this.$refs.c.searchData();
        }
      }
    }
  }
</script>
